<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>意见反馈</title>
    <meta
      name="viewport"
      content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"
    />
    <link href="../../../css/mui.min.css" rel="stylesheet" />
    <link href="../css/common.css" rel="stylesheet" />
    <style>
      .mui-content > .mui-table-view:first-child {
        margin-top: 1px;
      }

      .mui-table-view:after {
        left: 45px;
        height: 0;
      }
      .mui-bar {
        background-color: #0082e6;
      }

      .mui-table-view-cell:after,
      .mui-table-view:after {
        right: 20px;
      }
      .content {
        padding: 20px;
      }
      .titles {
        margin-bottom: 16px;
      }
      .imgss {
        float: left;
        margin-right: 10px;
      }
      .imgss img {
        width: 100%;
      }
      .signs {
        display: inline-block;
        width: 160px;
        height: 160px;
        border: solid 1px #3188fe;
        border-radius: 5px;
        margin-right: 10px;
        margin-bottom: 10px;
        position: relative;
        /* background-color: #D4E6FF; */
      }
      .signs img {
        width: 100%;
        height: 100%;
      }
      .uploads {
        display: inline-block;
        width: 160px;
        height: 160px;
        /* border-radius: 5px; */
        background: url(../img/dianjishangchuan.png) no-repeat;
        background-size: 100%;
        margin-bottom: 20px;
      }
      .fixed-btn {
        position: fixed;
        width: 100%;
        bottom: 0;
      }
    </style>
  </head>
  <body class="">
    <div id="container">
      <header class="mui-bar mui-bar-nav">
        <a
          class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left text-white"
        ></a>
        <h1 class="mui-title">意见反馈</h1>
      </header>
      <div class="mui-content">
        <div class="content">
          <div class="titles">意见反馈</div>
          <textarea
            name=""
            v-model="signInfo.remarks"
            id="areas"
            cols="30"
            rows="8"
          ></textarea>
          <div class="titles">上传图片</div>
          <div class="upsign">
            <div v-if="signInfo" class="imgss">
              <span
                class="signs"
                v-for="(item,index) in signInfo.files"
                :key="index"
              >
                <img :src="item.file_path?baseUrl + item.file_path:''" />
              </span>
            </div>
            <span class="uploads" @tap="addPic(3)"></span>
          </div>
        </div>
      </div>
      <div class="fixed-btn">
        <button type="button" @tap="subInfo()" class="mui-btn mui-btn-primary">
          提交
        </button>
      </div>
    </div>
    <script src="../../../js/mui.js"></script>
    <script src="../../../js/jquery-1.7.2.min.js"></script>
    <script src="../../../js/vue.js"></script>
    <script src="../js/main.js"></script>
    <script src="../js/mkeyplus.base.js"></script>
    <script src="../js/uploadImage.js"></script>
    <script type="text/javascript">
      mui.init()
      var vm = new Vue({
        el: "#container",
        data: {
          signInfo: {
            remarks: "",
            files: [],
          },
          baseUrl: mui.baseApp.serverUrl,
        },
        created: function () {},
        methods: {
          formatDate(tmp, fmt) {
            return mui.baseApp.formatDate(tmp, fmt)
          },
          // 添加图片
          addPic(index) {
            var that = this
            page.imgUp(function (path) {
              console.log("compress image path: " + path)
              plus.nativeUI.showWaiting("上传中")
              mui.baseApp.upLoadFile(path, function (res) {
                console.log(res)
                plus.nativeUI.closeWaiting()
                mui.toast("上传成功")
                that.signInfo.files.push({
                  file_id: res.data.id,
                  file_path: res.data.fileDirectory,
                })
              })
            })
          },
          getup(path) {
            mui.baseApp.upLoadFile(
              path,
              (data) => {
                console.log("www", data)
                // plus.nativeUI.closeWaiting();
              },
              function (erre) {
                // plus.nativeUI.closeWaiting()
                console.log("获取数据失败")
              }
            )
          },
          subInfo() {
            plus.nativeUI.showWaiting("提交中")
            mui.baseApp.httpRequst(
              "post",
              "/app/api/feedback/submit",
              this.signInfo,
              (data) => {
                console.log("www", data)
                plus.nativeUI.closeWaiting()
                mui.toast("提交成功")
                mui.back()
              },
              function () {
                plus.nativeUI.closeWaiting()
                console.log("获取数据失败")
              }
            )
          },
        },
      })
    </script>
  </body>
</html>
